<%
  var date = date();
%>
<div class="am-u-sm-12">
  <form class="am-form" id="list-form" action="${base}/broadbandorder/list" method="post">
    <input type="hidden" id="keywords" name="keywords" value='${keywords!""}' />
    <input type="hidden" id="isExport" name="isExport" value='${isExport!"0"}' />
    <table class="am-table am-table-bordered am-table-radius table-main am-padding-0">
      <tbody>
        <tr>
        <th class="am-text-middle">手机号码</th>
          <td>
            <div class="am-u-sm-10">
              <input type="text" id="telephone" class="am-form-field am-input-sm" value="${telephone!}" />
            </div>
          </td>
          <th class="am-text-middle">您的称呼</th>
          <td>
            <div class="am-u-sm-10">
              <input type="hidden" id="gender" value="${gender!}" />
              <div class="am-btn-group" data-am-button>
                <button class="am-btn am-btn-default am-btn-sm <%if(gender! == '0'){%>am-active<%}%>">
                  <input type="radio" name="gender" value="0"> 先生
                </button>
                <button class="am-btn am-btn-default am-btn-sm <%if(gender! == '1'){%>am-active<%}%>">
                  <input type="radio" name="gender" value="1"> 女士
                </button>
                <button class="am-btn am-btn-default am-btn-sm <%if(gender! == null){%>am-active<%}%>">
                  <input type="radio" name="gender" value=""> 所有
                </button>
              </div>
            </div>
          </td>
        </tr>
        <tr>
          <th class="am-text-middle">所在城市</th>
          <td>
            <div class="am-u-sm-10">
              <input type="text" id="city" class="am-form-field am-input-sm"  value="${city!}"/>
            </div>
          </td>
          <th class="am-text-middle">所属机构</th>
          <td>
            <div class="am-u-sm-10">
              <select data-am-selected="{btnSize:'sm',  maxHeight: 400}" id="org_id">
                <%for(orgNode in orgList){%>
                <option value="${orgNode.value}" <%if(org_id==orgNode.value){%>
                    selected
                    <%}%>>${orgNode.key}</option>
                <%}%>
              </select>
            </div>
          </td>
        </tr>
        <tr>
          <th class="am-text-middle">办理时间</th>
          <td colspan="3">
            <div class="am-u-sm-10">
              <div class="am-form am-form-inline">
                <div class="am-form-group am-form-icon">
                  <i class="am-icon-calendar"></i>
                  <input type="text" class="am-form-field am-input-sm" placeholder="开始时间" data-am-datepicker id="start" value="${start_date}" readonly>
                </div>
                <div class="am-form-group">至</div>
                <div class="am-form-group am-form-icon">
                  <i class="am-icon-calendar"></i>
                  <input type="text" class="am-form-field am-input-sm" placeholder="结束时间" data-am-datepicker id="end" value="${end_date}" readonly>
                </div>
                <span class="am-text-danger">*默认显示最近一个月的数据</span>
              </div>
            </div>
          </td>
        </tr>
        <tr>
          <td colspan="4">
            <div align='right'>
              <button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary" id="submit-btn">搜索</button>
              <%if(so.hasPermission("BROADBAND_ORDER_EXPORT")) {%>
              <button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary" id="export-btn">导出预约信息</button>
              <%}%>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </form>
</div>
<script type="text/javascript">
  $(function() {
    // 获取性别选中的值
    var $radios = $('[name="gender"]');
    $radios.on('change',function() {
      $("#gender").val($(this).filter(':checked').val());
    });
    //提交
    var keywordsObj = {};
    function setKeyWords(){
    	if($("#telephone").val())
            keywordsObj.telephone = $("#telephone").val();
          if($("#gender").val())
            keywordsObj.gender = $("#gender").val();
          if($("#city").val())
            keywordsObj.city = $("#city").val();
          if($("#org_id").val())
            keywordsObj.org_id = $("#org_id").val();
          var start = $("#start").val();
          var end = $("#end").val();
          if(start && end){
            keywordsObj.start_date = start;
            keywordsObj.end_date = end;
            keywordsObj.create_date = start + "|" + end;
          }

          var keywords = "";
          if(!$.isEmptyObject(keywordsObj)){
            keywords = JSON.stringify(keywordsObj);
          }
          console.log("keywords = "+ keywords);

          $("#keywords").val(keywords);
    }
    
    $("#submit-btn").on("click",function(){
      setKeyWords();
      $("#isExport").val("0");
      $("#list-form").submit();
    });
    
    // 导出预约信息
    $("#export-btn").on("click",function(){
    	setKeyWords();
        $("#isExport").val("1");
        $("#list-form").submit();
      });
  });
</script>